<script type="text/javascript">

    var selected_date;
    var cur_days = new Array();
    var that;   //Buisy loader
    var p = base_url+'assets/img/busy.gif';   //img path               

    $(document).ready(function(){ 


            jQuery.fn.ajaxLoader = function (conf) {
                var config = jQuery.extend({
                        className:        'jquery-ajax-loader', 
                        fadeDuration:    1
                    }, conf);

                return this.each(function () {
                        var t = jQuery(this);

                        if (!this.ajaxLoaderObject) {
                            var offset = t.offset();
                            var dim = {
                                left:    offset.left, 
                                top:    offset.top, 
                                width:    t.outerWidth(), 
                                height:    t.outerHeight()
                            };

                            this.ajaxLoaderObject = jQuery('<div class="' + config.className + '"></div>').css({
                                    position:    'absolute', 
                                    left:        dim.left + 'px', 
                                    top:        dim.top + 'px',
                                    width:        dim.width + 'px',
                                    height:        dim.height + 'px'
                            }).appendTo(document.body).hide();
                        }

                        this.ajaxLoaderObject.fadeIn(config.fadeDuration);
                });
            };

            jQuery.fn.ajaxLoaderRemove = function () {
                return this.each(function () {
                        if (this.ajaxLoaderObject) {
                            this.ajaxLoaderObject.fadeOut(1);
                        }
                });
            };

            /***********************************************************
            * JQUERY UI Calendar with event
            ***********************************************************/
            // get the current date
            var date = new Date();
            var m = date.getMonth(),
            d = date.getDate() + 1,
            y = date.getFullYear();

            function cal_init(){
                $('#exc_date').datepicker({    
                        minDate: new Date(y, m, d),
                        maxDate: new Date(y, m+3, d),
                        dateFormat: 'dd.mm.yy',
                        inline:true,
                        numberOfMonths: 1,
                        onSelect: function(dateStr){
                            selected_date = $.datepicker.parseDate('dd.mm.yy', dateStr);
                        },
                        beforeShowDay: enableDaysOfWeek ,
                        showOn: 'button',
                        buttonImage: base_url+'assets/img/backgrounds/cal_orange.gif',
                        buttonImageOnly: true
                });

            }

            // Custom function to enable one only day in jquery calender
            function enableDaysOfWeek(date) {

                var day = date.getDay();            
                cond = false;

                for(var k in cur_days){

                    if(day==cur_days[k]){
                        cond = true;
                    }

                }

                //console.log(cond)                   
                return [(cond)];

            }     

            /***********************************************************
            * Calculator
            ***********************************************************/
            $('#adults').live('change',function(){calculate();}); 
            $('#children').live('change',function(){calculate();}); 

            function calculate(){

                var adults = $('#adults').val() * $('#adult-price').text();
                var children = $('#children').val()* $('#children-price').text();
                $('#total-price').text(adults+children);
                $('[name=totalprice]').val(adults+children);
                $('[name=adultprice]').val($('#adult-price').text());
                $('[name=chprice]').val($('#children-price').text());

            }

            /***********************************************************
            * Confirm Availability
            ***********************************************************/
            $('#confirm').live('click',function(){ 
                    that = jQuery(this).parent().busy({ img : p })
                    if(check()){
                        $('#checkAvailable').submit();
                    }else{
                        return false;
                    }

            });

            function check(){
                if($('#adults').val()==0){
                    alert ("Please select at least one adult person.");
                    that.busy("hide"); 
                    return false;
                }
                if(selected_date==undefined){
                    alert('plese select date!');
                    that.busy("hide");
                    return false;
                } 
                if($('#total-price').text()=='0'){
                    alert('plese select al lest one person!');
                    that.busy("hide");
                    return false;
                }
                return true;   
            }                       

            /*ID TABS WITH SELECTORS*/
            jQuery('#atlas_tabs ul').idTabs();

            $('#atlas_tabs > ul > li > a').click(function(){                    

                    $(this).parent().parent().find(".on").removeClass('on');

                    $(this).closest('li').addClass('on'); 

            });  

            $('#exc_date').val('');
            $('#exc_date').live('click', function(){ $('#exc_date').blur(); });

            $('#adults').val(2);
            $('#children').val(0);

            cal_init();

            calculate();

    });

</script>

<script type="text/javascript">
    <?  

        $disabled_days = array();
        $days = explode(',',$excursion->startWeekDay);


        if(is_numeric(array_search('Sunday', $days))){
            array_push($disabled_days, 0);
        }
        if(is_numeric(array_search('Monday', $days))){
            array_push($disabled_days, 1);
        }
        if(is_numeric(array_search('Tuesday', $days))){
            array_push($disabled_days, 2);
        }
        if(is_numeric(array_search('Wednesday', $days))){
            array_push($disabled_days, 3);
        }
        if(is_numeric(array_search('Thursday', $days))){
            array_push($disabled_days, 4);
        }
        if(is_numeric(array_search('Friday', $days))){
            array_push($disabled_days, 5);
        }
        if(is_numeric(array_search('Saturday', $days))){
            array_push($disabled_days, 6);
        }


        //$this->firephp->log($days);
        //$this->firephp->log($disabled_days); 

        foreach($disabled_days as $key => $value){?>

        cur_days['<?=$key?>'] = '<?=$value?>';

        <?} 

    ?>  


</script>

<div class="wrapper bgwhite" style="width: 980px; border-radius: 2px; position: relative;">
    
    <!--<div id="flags_sys" class="radius clearfix">

        <ul>

            <li><a href="<?=base_url($this->lang->switch_uri('me'));?>"><img src="<?=$url;?>assets/img/flags/me.png" alt="Crnogorski" title="Crnogorski" /></a></li>
            <li><a href="<?=base_url($this->lang->switch_uri('ru'));?>"><img src="<?=$url;?>assets/img/flags/ru.png" alt="Rусский" title="Rусский" /></a></li>
            <li><a href="<?=base_url($this->lang->switch_uri('en'));?>"><img src="<?=$url;?>assets/img/flags/en.png" alt="English" title="English" /></a></li>

        </ul>       

    </div>-->
    
    <div id="body" class="clearfix" style="padding-bottom: 90px;">
        
        <!--EXCURSIONS ONLINE BOOKING-->
        <div id="e321">

            <div class="excursions">

                <h1 class="franklin_gothic_metium_cond">Online Booking :: Excursions</h1>

                <br />

                <div class="picturebox" style="padding-bottom: 0;">


                    <?

                        if(isset($excursion->g_path)):

                            foreach($gallery as $picture):

                                $pic_arr = explode('.',$picture->filename);
                                $thumb_filename = 'thumbnail/'.$pic_arr[0].'_200x150_exacttop.'.$pic_arr[1];
                                $big_filename = 'thumbnail/'.$pic_arr[0].'_800x600_exacttop.'.$pic_arr[1];                                    


                            ?>

                            <a rel="lightbox" title="<?=$excursion->title?>" href="<?=$hosting?>pro-gallery/<?=$excursion->g_path?>/<?=$big_filename?>" >
                                <img alt="<?=$excursion->title?>" src="<?=$hosting?>pro-gallery/<?=$excursion->g_path?>/<?=$thumb_filename?>" />
                            </a>

                            <?
                                endforeach;

                            endif; 
                    ?>

                </div>

                <div class="exc" style="width: 649px !important;">
                    <div class="top_spacer"></div>
                    <div class="top_border"></div>

                    <!--ATLAS-->
                    <div class="atlas_content_title">
                        <div class="atlas_content_title_inner">

                            <div class="product_price">

                                <div class="bbborder_top_right">
                                    <div class="bbborder_top_left">
                                        <span style="float: right;"><img src="<?=base_url()?>assets/img/backgrounds/product_lowprice_<?=$local_lang?>.gif" /></span>

                                        <span style="float: left; margin-top: 9px;">from eur</span>

                                        <br class="clearing" />

                                        <span class="price" style="float: left"><em><span>&euro;  </span><?=$excursion->adultPrice?></em></span>  <br class="clearing" /> 
                                        <span style="float: left">Per person</span>  <br class="clearing" />

                                    </div>
                                </div>

                                <div class="bbborder_bot_right">
                                    <div class="bbborder_bot_left">
                                        &nbsp;
                                    </div>
                                </div>

                            </div>

                            <div class="atlas_content_intro">
                                <h1><?=$excursion->title?></h1>                                

                                <div id="atlas_list">
                                    <ul>
                                        <li><strong>Start day:</strong><span>

                                                <?
                                                    echo $excursion->startWeekDay;
                                                ?>

                                            </span></li>
                                        <li><strong>Duration:</strong><span>1 day</span></li>
                                        <li><strong>Guides:</strong><span><?=$excursion->guides?></span></li>
                                    </ul>
                                </div>

                            </div>          

                            <div id="atlas_tabs">
                                <ul class="idTtabs">
                                    <li class="on"><a href="#info_tab" id="info_a"><span>Information</span></a></li>
                                    <li><a href="#pickup_tab" id="pickup_a"><span>Pickup info</span></a></li> 
                                    <li><a href="#add_tab" id="add_a"><span>Itinerary Detials</span></a></li> 
                                </ul>
                            </div>

                            <br class="clearing" />

                        </div>
                    </div> 

                    <div class="desc_main body-wrap">
                        <div id="info_tab" style="display: block;">
                            <div class="desc_txt"><?=$excursion->excursion_text?></div>
                        </div>
                        <div id="pickup_tab" style="display:none;">
                            <div class="desc_txt"><?=$excursion->pickup_location?></div>
                        </div>
                        <div id="add_tab" style="display:none;">
                            <div class="desc_txt"><?=$excursion->addition?></div>
                        </div>
                    </div>

                    <div class="side">  

                        <!--BOOKING IN 2 STEPS-->
                        <div id="quote" class="mk_mod quote">

                            <form action="<?=base_url('client/check_available')?>" method="POST" id="checkAvailable">

                                <input type="hidden" value="<?=$excursion->id?>" id="exc_id" name="exc_id">

                                <div class="mk_head_wrap orange">
                                    <div class="mk_head">
                                        <span>Bookig in two easy steps</span>
                                    </div>
                                </div>

                                <div class="mk_body">

                                    <? if(isset($booking_msg)): ?>
                                        <br />
                                        <div class="error" style="margin-left:10px;margin-right:10px;">
                                            <p style="padding: 10px; line-height: 19px;"><?=$booking_msg?></p>
                                        </div>

                                        <? endif; ?>

                                    <div class="easystep_one">
                                        <label for="exc_date">Select date</label><br />
                                        <p style="margin-top: 4px;">
                                            <input id="exc_date" name="exc_date" class="pad_text_left" />
                                        </p>

                                    </div>

                                    <div class="easystep_two">
                                        <label>Enter total number of travelers</label><br />
                                        <div class="calculator">
                                            <!-- <strong><em>Calculator:</em></strong>   <br>-->
                                            <div class="calc_left" >
                                                <div class="adl">
                                                    <label for="adults" class="pad_label">Adults:</label>
                                                    <select name="adults" id="adults" style="width: 40px;">
                                                        <?
                                                            for ($i=0;$i<10;$i++) {
                                                                if($i!=2){                                                               
                                                                    echo "<option value=".$i." >" . $i . "</option>";
                                                                }else{ 
                                                                    echo "<option value=".$i." selected=selected>" . $i . "</option>";    
                                                                } 
                                                            }
                                                        ?>
                                                    </select>

                                                    <span>EUR <span id="adult-price"><?=$excursion->adultPrice?></span> / person</span><br id="a_price" class="clearing" />
                                                </div>
                                                <div class="ch"> 
                                                    <label for="children" class="pad_label">Children:</label>
                                                    <select name="children" id="children" style="width: 40px;">
                                                        <?
                                                            for ($i=0;$i<10;$i++) {
                                                                if($i!=0){                                                               
                                                                    echo "<option value=".$i." >" . $i . "</option>";
                                                                }else{ 
                                                                    echo "<option value=".$i." selected=selected>" . $i . "</option>";    
                                                                } 
                                                            }
                                                        ?>
                                                    </select>

                                                    <span>EUR <span id="children-price"><?=$excursion->childPrice?></span> / person</span><br id="c_price" class="clearing" />
                                                </div> 
                                            </div>

                                            <div class="calc_right">Total cost: <br><span id="total-price"></span> &euro;</div> 

                                            <input type="hidden" name="totalprice" value="123" />
                                            <input type="hidden" name="adultprice" value="123" />
                                            <input type="hidden" name="chprice" value="123" />

                                            <br class="clearing" />
                                        </div>

                                    </div>

                                    <div class="btn_box">
                                        <div style="margin: 20px 0 10px 0; float: right;">
                                            <div class="atlas_btn" style="margin-right:0;">

                                                <input type="submit" value="Confirm availability" id="confirm" />

                                            </div>
                                            <br class="clearing" /> <br />
                                        </div>

                                        <div style="clear: both;"></div>
                                    </div>

                                    <div class="easystep_bottom">
                                        <strong>Please note:</strong>
                                        After your purchase is confirmed, voucher will be sent to Your e-mail address.                        
                                    </div>


                                </div>  

                            </form>

                        </div>    

                    </div>



                </div>

                <br class="clearing">

                <script type="text/javascript">
                    $(function() {

                            $('a[rel=lightbox]').lightBox({
                                    overlayBgColor: '#000',
                                    overlayOpacity: 0.6,
                                    imageLoading: base_url+'assets/img/lightbox/loading.gif',
                                    imageBtnClose: base_url+'assets/img/lightbox/close.gif',
                                    imageBtnPrev: base_url+'assets/img/lightbox/prev.gif',
                                    imageBtnNext: base_url+'assets/img/lightbox/next.gif',
                                    imageBlank : base_url+'assets/img/lightbox/blank.gif',
                                    containerResizeSpeed: 350,
                                    txtImage: 'Image',
                                    txtOf: 'of'
                            });
                    });
                </script>


            </div>

        </div>
        
    </div>
</div>